/*
 * @Description: 普通插槽
 * @version: 1.0
 * @Author: ziwei
 * @Date: 2021-09-08 22:46:25
 * @LastEditors: ziwei
 * @LastEditTime: 2021-09-09 08:06:29
 */
const VueTemplateCompiler = require('vue-template-compiler');
// let ele = VueTemplateCompiler.compile(`
// <my-componnet>
//   <div slot="header">node</div>
//   <div>react</div>
//   <div slot="footer"></div>
// </my-componnet>
// `)

// with(this) {
//     return _c('my-componnet', [_c('div', {
//         attrs: {
//             "slot": "header"
//         },
//         slot: "header"
//     }, [_v("node")]), _v(" "), _c('div', [_v("react")]), _v(" "), _c('div', {
//         attrs: {
//             "slot": "footer"
//         },
//         slot: "footer"
//     })])
// }
//普通插槽就是替换的过程，将父组件渲染好的结果直接替换到自己身上，相当于在父组件渲染的
// let ele = VueTemplateCompiler.compile(`
// <div>
// <slot name="header"></slot>
// <slot name="footer"></slot>
// <slot></slot>
// </div>
// `)
// console.log(ele);
// with(this) {
//     return _c('div', [_t("header"), _v(" "), _t("footer"), _v(" "), _t("default")], 2)
// }
// let ele = VueTemplateCompiler.compile(`<app>
// <div slot-scope="msg" slot="slot">{{msg.a}}</div>
// </app>`)
// console.log(ele);
// with(this) {
//     return _c('app', {
//         scopedSlots: _u([{
//             key: "slot",
//             fn: function (msg) {
//                 return _c('div', {}, [_v(_s(msg.a))])
//             }
//         }])
//     })
// }
let ele = VueTemplateCompiler.compile('<div><slot name="footer" a="1" b="2"></slot></div>');
console.log(ele);
with(this) {
    return _c('div', [_t("footer", null, {
        "a": "1",
        "b": "2"
    })], 2)
}